<!-- 学习中心 -->
<template>
	<view id="body">
		<!-- 导航条 -->
		<view class="nav">
			<!-- 类型详细分类 -->
			<view class="type">
				<u-tabs :list="type" @click="fl" lineColor="#3c9cff":inactiveStyle="{fontSize:'28rpx',}" :activeStyle="{fontSize:'28rpx'}"></u-tabs>
			</view>
		</view>
		<!-- 搜索 -->
		<view class="search"> 
			<u-search placeholder="请输入搜索内容" v-model="keyword" :showAction="false" @search="search"></u-search>
		</view>
		<!-- 发布图标 -->
		<view class="fabu" @click="add"> 
			<text class="t-icon t-icon-fabu2" style="width: 60rpx;height: 60rpx;"></text>
		</view>
		<!-- 帖子内容 -->
		<view class="posting">
			<view class="posting-card" v-for="(item,index) in PostIndo" :key="index" @click="postcardchlick(index)">
				<!-- 用户头像 -->
				<view class="userImg">
					<image :src="item.issueUserImg" class="user-logo"></image>
				</view>
				<!-- 用户名称 -->
				<view class="user-name">
					<text>{{item.issueUserName}}</text>
				</view>
				<!-- 帖子时间 -->
				<view class="createTime">
					<text>{{item.createTime}}</text>
				</view>
				<!-- 帖子内容 -->
				<view class="content">
					<text>{{item.content}}</text>
				</view>
				<!-- 标签样式 -->
				<view class="cssshape">
					<text class="cssshape-text">{{type[item.type - 1].name}}</text>
				</view>
				<!-- 图片列表 -->
				<view class="img">
					<view class="imgview">
						<image :src="item.postIndeximg" class="imgList-img"></image>
					</view>
				</view>
				<!-- 定位 -->
				<view class="dingwei">
					<view class="dingweitubiao">
						<text class="t-icon t-icon-dingwei" style="width: 40rpx;height: 40rpx;"></text>
					</view>
					<view class="dingweitext">
						<text v-if="item.location.length > 0">{{item.location}}</text>
						<text v-if="item.location.length == 0">暂无定位</text>
					</view>
					<!-- 点赞 -->
					<view class="dianzan">
						<text :class="item.dianzantb" style="width: 40rpx;height: 40rpx;" @click.stop="dianzanclick(item.id)"></text>
						<text class="dianzannum" v-if="item.dianzantb == 't-icon t-icon-dianzan-copy'" style="color: #3c9cff;">{{item.praisenum}}</text>
						<text class="dianzannum" v-if="item.dianzantb == 't-icon t-icon-dianzan'">{{item.praisenum}}</text>
					</view>
					<!-- 评论图标 -->
					<view class="comment">
						<text class="t-icon t-icon-pinglun" style="width: 40rpx;height: 40rpx;" @click.stop="commentclick(item.id)"></text>
						<text class="commentnum">{{item.commentnum}}</text>
					</view>
					<!-- 分享 -->
					<view class="share">
						<text class="t-icon t-icon-fenxiang2" style="width: 40rpx;height: 40rpx;" @click.stop="shareclick(item.id)"></text>
						<text class="sharenum">{{item.sharenum}}</text>
					</view>
				</view>
			</view> 
		</view>
		<!-- 评论模态框 -->
		<view>
			<u-popup :show="show" :round="10" mode="bottom" @close="close" @open="open" >
				<view class="ct">
					<view class="ctview">
						<input placeholder="评论内容" v-model="cttext" />
					</view>
					<view class="plbutton" @click="plbutton">
						<text style="line-height: 68rpx;">发布评论</text>
					</view>
				</view>
			</u-popup>
		</view>
		<!-- 加载动画 -->
		<view class="loading" >
			<u-loadmore :status="status" :line="line" :nomoreText="nomoreText" /> 
		</view>
	</view>
</template>

<script>
	import {http} from "../static/service/requestAddress/rtas.js"
	export default {
		data() {
			return {
				keyword:"",//搜索框内容
				type:[
					{
						name:"分享",
					},
					{
						name:"求助",
					},
					{
						name:"帮忙",
					},
				],
				PostIndo:[],//帖子信数据数组
				dianzantb: "t-icon t-icon-dianzan",//点赞样式
				status:"loading",
				nomoreText:"——没有更多了——",
				show:false,
				commentclickId:"",//点击的帖子id
				cttext:"",//评论内容
				page:0,//分页数
				typenum:0,//切换订单类型下标
				ss:false,//是否是搜索标记
				ssnum:0,//搜索分页下标
				sskey:"",//上次搜索内容
			}
		},
		created() {
			//获取数据
			this.status = "loading"
			uni.request({
				url:http+"study/"+0+"/"+0,
				method:"GET",
				complete:(res) =>{
					if(res.data.code == 20021){
						//对数据进行处理
						var datalist = res.data.date
						if(datalist == [] | datalist.length == 0){
							this.PostIndo = datalist
							this.status = "nomore"
							this.page += 1
							return
						}
						for(var i = 0; i < datalist.length; i++){
							datalist[i].createTime = (datalist[i].createTime).substring(0,datalist[i].createTime.lastIndexOf(" "))
							//处理图标样式
							datalist[i].dianzantb = "t-icon t-icon-dianzan"
						}
						//对点赞图标进行处理
						var user = uni.getStorageSync('user')
						//验证用户是否登录
						if(user){
							var userid = JSON.parse(user).id
							for(var j = 0;j<datalist.length;j++){
								//判断用户点赞id集合是否为空
								if(datalist[j].praiseUseridlist != ""){
									var praiseList = datalist[j].praiseUseridlist.split(",")
									//去掉空串
									praiseList = praiseList.filter(b=>b && b.trim())
									var T = false
									for(var b = 0; b < praiseList.length;b++){
										//用户点赞集合里有该登录用户的id就改变图标样式
										if(praiseList[b] == ""+userid){
											//增加属性
											datalist[j].dianzantb = "t-icon t-icon-dianzan-copy"
											T = true
											break
										}
									}
									if(! T){
										datalist[j].dianzantb = "t-icon t-icon-dianzan"
									}
								}else{
									datalist[j].dianzantb = "t-icon t-icon-dianzan"
								}
							}
						}
						this.PostIndo = datalist
						this.status = "nomore"
						this.page += 1
					}
				}
			})
		},
		//上拉加载
		onReachBottom() {
			console.log("触发了上拉加载")
			this.status = "loading"
			var url = ""
			// 是搜索的下拉分页的情况
			if(this.ss){
				url = http+"study/search/"+this.keyword+"/"+this.typenum+"/"+this.ssnum
			}else{
				url = http+"study/"+this.typenum+"/"+this.page
			}
			uni.request({
				url:url,
				method:"GET",
				complete:(res) =>{
					if(res.data.code == 20021){
						if(res.data.date == "" & res.data.date.length <= 0){
							uni.$u.toast("没有更多了!")
						}
						var datalist = res.data.date
						//对数据进行处理
						var datalist = res.data.date
						for(var i = 0; i < datalist.length; i++){
							datalist[i].createTime = (datalist[i].createTime).substring(0,datalist[i].createTime.lastIndexOf(" "))
							//处理图标样式
							datalist[i].dianzantb = "t-icon t-icon-dianzan"
						}
						//对点赞图标进行处理
						var user = uni.getStorageSync('user')
						//验证用户是否登录
						if(user){
							var userid = JSON.parse(user).id
							for(var j = 0;j<datalist.length;j++){
								//判断用户点赞id集合是否为空
								if(datalist[j].praiseUseridlist != ""){
									var praiseList = datalist[j].praiseUseridlist.split(",")
									//去掉空串
									praiseList = praiseList.filter(b=>b && b.trim())
									var T = false
									for(var b = 0; b < praiseList.length;b++){
										//用户点赞集合里有该登录用户的id就改变图标样式
										if(praiseList[b] == ""+userid){
											//增加属性
											datalist[j].dianzantb = "t-icon t-icon-dianzan-copy"
											T = true
											break
										}
									}
									if(! T){
										datalist[j].dianzantb = "t-icon t-icon-dianzan"
									}
								}else{
									datalist[j].dianzantb = "t-icon t-icon-dianzan"
								}
							}
						}
						this.PostIndo = this.PostIndo.concat(datalist)
						this.status = "nomore"
						//增加分页值
						if(this.ss){
							this.ssnum += 1
						}else{
							//增加分页值
							if(res.data.date != null & res.data.date.length > 0){
								this.page += 1
							}
						}
					}else{
						uni.$u.toast("获取数据失败!")
					}
				}
			})
		},
		onShow(){
			//获取数据
			this.status = "loading"
			uni.request({
				url:http+"study/"+this.typenum+"/"+0,
				method:"GET",
				complete:(res) =>{
					if(res.data.code == 20021){
						//对数据进行处理
						var datalist = res.data.date
						if(datalist == [] | datalist.length == 0){
							this.PostIndo = datalist
							this.status = "nomore"
							this.page += 1
							return
						}
						for(var i = 0; i < datalist.length; i++){
							datalist[i].createTime = (datalist[i].createTime).substring(0,datalist[i].createTime.lastIndexOf(" "))
							//处理图标样式
							datalist[i].dianzantb = "t-icon t-icon-dianzan"
						}
						//对点赞图标进行处理
						var user = uni.getStorageSync('user')
						//验证用户是否登录
						if(user){
							var userid = JSON.parse(user).id
							for(var j = 0;j<datalist.length;j++){
								//判断用户点赞id集合是否为空
								if(datalist[j].praiseUseridlist != ""){
									var praiseList = datalist[j].praiseUseridlist.split(",")
									//去掉空串
									praiseList = praiseList.filter(b=>b && b.trim())
									var T = false
									for(var b = 0; b < praiseList.length;b++){
										//用户点赞集合里有该登录用户的id就改变图标样式
										if(praiseList[b] == ""+userid){
											//增加属性
											datalist[j].dianzantb = "t-icon t-icon-dianzan-copy"
											T = true
											break
										}
									}
									if(! T){
										datalist[j].dianzantb = "t-icon t-icon-dianzan"
									}
								}else{
									datalist[j].dianzantb = "t-icon t-icon-dianzan"
								}
							}
						}
						this.PostIndo = datalist
						this.status = "nomore"
						this.page += 1
					}
				}
			})
		},
		methods:{
			//搜过方法
				search(){
					if(this.keyword == "" | this.keyword.length  == 0){
						uni.$u.toast("搜索内容不能为空")
						return
					}
					this.PostIndo = []
					this.status = "loading"
					if(!this.ss){
						this.ss = true
					}
					//搜索内容不同时，重置页数
					if(this.keyword != this.sskey){
						this.sskey =this.keyword
						this.ssnum = 0
					}
					uni.request({
						url:http+"study/search/"+this.keyword+"/"+this.typenum+"/"+this.ssnum,
						method:"GET",
						complete:(res)=>{
							if(res.data.code == 20021){
								if(res.data.date == null){
									this.status = "nomore"
								}else{
									//对数据进行处理
									var datalist = res.data.date
									for(var i = 0; i < datalist.length; i++){
										datalist[i].createTime = (datalist[i].createTime).substring(0,datalist[i].createTime.lastIndexOf(" "))
										//处理图标样式
										datalist[i].dianzantb = "t-icon t-icon-dianzan"
									}
									//对点赞图标进行处理
									var user = uni.getStorageSync('user')
									//验证用户是否登录
									if(user){
										var userid = JSON.parse(user).id
										for(var j = 0;j<datalist.length;j++){
											//判断用户点赞id集合是否为空
											if(datalist[j].praiseUseridlist != ""){
												var praiseList = datalist[j].praiseUseridlist.split(",")
												//去掉空串
												praiseList = praiseList.filter(b=>b && b.trim())
												var T = false
												for(var b = 0; b < praiseList.length;b++){
													//用户点赞集合里有该登录用户的id就改变图标样式
													if(praiseList[b] == ""+userid){
														//增加属性
														datalist[j].dianzantb = "t-icon t-icon-dianzan-copy"
														T = true
														break
													}
												}
												if(! T){
													datalist[j].dianzantb = "t-icon t-icon-dianzan"
												}
											}else{
												datalist[j].dianzantb = "t-icon t-icon-dianzan"
											}
										}
									}
								}
								this.PostIndo = datalist
								this.status ="nomore"
								this.ssnum += 1
							}else{
								uni.$u.toast("获取内容失败!")
							}
						}
					})
				},
				//添加帖子
				add(){	
					console.log("点击了增加帖子")
					uni.navigateTo({
						url:"/study/studyadd"
					})
				},
				//切换分类
				fl(item){
					console.log("点击了分类"+item.index)
					this.status = "loading"
					this.typenum = item.index
					this.ss = false 
					this.ssnum = 0
					this.PostIndo = []
					uni.request({
						url:http+"study/"+this.typenum+"/0",
						method:"GET",
						complete:(res) =>{
							if(res.data.code == 20021){
								if(res.data.date == null){
									this.status = "nomore"
									uni.$u.toast("没有更多了!")
								}else{
									//对数据进行处理
									var datalist = res.data.date
									for(var i = 0; i < datalist.length; i++){
										datalist[i].createTime = (datalist[i].createTime).substring(0,datalist[i].createTime.lastIndexOf(" "))
										//处理图标样式
										datalist[i].dianzantb = "t-icon t-icon-dianzan"
									}
									//对点赞图标进行处理
									var user = uni.getStorageSync('user')
									//验证用户是否登录
									if(user){
										var userid = JSON.parse(user).id
										for(var j = 0;j<datalist.length;j++){
											//判断用户点赞id集合是否为空
											if(datalist[j].praiseUseridlist != ""){
												var praiseList = datalist[j].praiseUseridlist.split(",")
												//去掉空串
												praiseList = praiseList.filter(b=>b && b.trim())
												var T = false
												for(var b = 0; b < praiseList.length;b++){
													//用户点赞集合里有该登录用户的id就改变图标样式
													if(praiseList[b] == ""+userid){
														//增加属性
														datalist[j].dianzantb = "t-icon t-icon-dianzan-copy"
														T = true
														break
													}
												}
												if(! T){
													datalist[j].dianzantb = "t-icon t-icon-dianzan"
												}
											}else{
												datalist[j].dianzantb = "t-icon t-icon-dianzan"
											}
										}
									}
									this.PostIndo = datalist
									this.status = "nomore"
									//重置分页值
									this.page = 1
							}
							}else{
								uni.$u.toast("获取数据失败!")
							}
						}
					})
				},
				//点击增加取消点赞
				dianzanclick(ids){
					//对用户登录进行判断
					var user = uni.getStorageSync('user')
					var userid = 0
					if(! user){
						uni.$u.toast("您还未登录，登录后才能点赞")
						return
					}else{
						userid = JSON.parse(user).id
					}
					var praiseList = []//用户点赞id集合
					var T = this.PostIndo
					var promise = new Promise(function(reslove,reject){
						for(var i = 0; i <T.length;i++){
							if(T[i].id == ids){  
								//获取redis中的点赞数量，移除对应的数据，此处如果是只访问本地的话数据会错
								uni.request({
									url:http+"study/commentNum/"+T[i].id,
									method:"GET",
									complete:(res)=>{
										if(res.data.code == 20021){
											if(res.data.date != "" & res.data.date.length > 0){
												praiseList = res.data.date.split(",")
												//去掉空串
												praiseList = praiseList.filter(b=>b && b.trim())
												reslove(praiseList.length)
											
										}else{
											reject(praiseList.length)
										}
									}
								}
							}) 
						}
						}
					})
					promise.then(res=>{
						var that = this
						var data = that.PostIndo
						//不是第一次点赞的情况
							//1.判断点赞用户集合中是否有自己的id，如果有就移除，同时更新数据
							for(var i = 0;i < praiseList.length;i++){
								if(praiseList[i] == userid){
									praiseList.splice(i,1)//移除对应用户id
										var T = ""
										if(praiseList == "" | praiseList.length == 0){
											T = "aaa"
										}else{
											T = praiseList.join(",")//转换成字符串
										}
										//更新数据库
										uni.request({
											url:http+"study/praise/"+T+"/"+praiseList.length+"/"+ids,
											method:"PUT",
											complete: (res) =>{
												if(res.data.code == 20041){
													for(var t = 0; t <data.length;t++){
														if(data[t].id == ids){
														that.PostIndo[t].praisenum -= 1
														that.PostIndo[t].praiseUseridlist = praiseList.join(",")
														that.dianzantb = "t-icon t-icon-dianzan"
														that.PostIndo[t].dianzantb = "t-icon t-icon-dianzan"
														uni.$u.toast("点赞成功")
														return
														}
													}
												}else{
													uni.$u.toast("点赞失败")
												}
											}
										})
										return
								}
							}
							//2.如果点赞用户集合中没有自己的id，就增加，同时更新数据
							praiseList = praiseList.concat(""+userid)
							uni.request({
								url:http+"study/praise/"+praiseList.join(",")+"/"+praiseList.length+"/"+ids,
								method:"PUT",
								complete: (res) =>{
									if(res.data.code == 20041){
										for(var t = 0; t < data.length;t++){
											if(data[t].id == ids){
												that.PostIndo[t].praisenum += 1
												that.PostIndo[t].praiseUseridlist = praiseList.join(",")
												that.PostIndo[t].dianzantb = "t-icon t-icon-dianzan-copy"
												uni.$u.toast("点赞成功")
												return
											}
										}
									}else{
										uni.$u.toast("点赞失败")
									}
								}
							})
					}).catch(err=>{
						var that = this
						var data = that.PostIndo
						//当获取的用户点赞id数组为空时，说明是第一次点赞
						if( praiseList.length == 0){
							praiseList.push(""+userid+",")
							uni.request({
								url:http+"study/praise/"+praiseList[0]+"/"+1+"/"+ids,
								method:"PUT",
								complete: (res) =>{
								console.log("点赞的结果是："+JSON.stringify(res.data))
									if(res.data.code == 20041){
										for(var t = 0; t < data.length;t++){
											if(data[t].id == ids){
												that.PostIndo[t].praisenum += 1
												that.PostIndo[t].praiseUseridlist = praiseList.join(",")
												that.PostIndo[t].dianzantb = "t-icon t-icon-dianzan-copy"
												uni.$u.toast("点赞成功")
												return
											}
										}
									}else{
										uni.$u.toast("点赞失败")
									}
								}
							})
						}
					})
				},
				//点击了评论回复
				commentclick(id){
					console.log("点击了评论图标"+id)
					this.show = true
					this.commentclickId = id
				},
				//点击了分享图标
				shareclick(id){
					uni.$u.toast("管理员关闭了分享功能")
				},
				//点击了动态详情
				postcardchlick(index){
					console.log("传递的数据是："+JSON.stringify(this.PostIndo[index]))
					uni.navigateTo({
						url:"/study/info?data="+ JSON.stringify(this.PostIndo[index]) 
					})
				},
				//打开模态框
				open(){
					this.show = true
				},
				//关闭模态框
				close(){
					this.show = false
				},
				//发布评论
				plbutton(){
					uni.showLoading({
						title:"正在评论中",
						mask: true
					})
					var user = uni.getStorageSync('user')
					//验证用户是否登录
					if(! user){
						uni.$u.toast("您还未登录，登录才能发布评论")
						return
					}
					if(this.cttext == "" | this.cttext .length == 0){
						uni.$u.toast("评论内容不能为空")
						return
					}
					var userid = JSON.parse(user).id
					var username = JSON.parse(user).name
					var userimg = JSON.parse(user).img
					var fistcommentdata = {
						"id":"",
						"content":this.cttext,
						"commentUserid":userid,
						"commentUsername":username,
						"commentUserimg":userimg,
						"answerIdlist":"",
						"belongpost":this.commentclickId,
						"state":0
					}
					uni.request({
						url:http+"studyfistcomment",
						method:"POST",
						data:fistcommentdata,
						complete:(res)=>{
							if(res.data.code == 20011){
								for(var i = 0; i< this.PostIndo.length;i++){
									if(this.PostIndo[i].id == this.commentclickId){
										this.PostIndo[i].commentidlist += res.data.date.id +","
										this.PostIndo[i].commentnum += 1
										this.PostIndo = this.PostIndo
										this.cttext = ""
											uni.$u.toast("评论成功!")
										return
									}
								}
							}else{
								uni.$u.toast("评论失败!")
							}
						}
					})
					this.show = false
					uni.hideLoading()
				}
			
		}
	}
</script> 

<style>
	@import url("../static/css/componentsCss/study/index.css");
</style>